import QtQuick 2.12
import QtQuick.Controls 2.5
import QtQuick.Layouts 1.12
import QtQml 2.12
Rectangle{
    id:chatPage
    property int btnWidth :45
    property int btnHeight :45
    property int iconWidth :30
    property int iconHeight :30
    property int btNtopMargin :2




    anchors.fill: parent
    color:"red"
    RowLayout{
        anchors.fill: parent
        spacing: 0
        Rectangle{
            id:menuList
            Layout.preferredWidth: 75
            Layout.preferredHeight:  parent.height
            color: "#2e2e2e"
            ColumnLayout{
                anchors.fill: parent
                Image{
                    id:userImg
                    source: user.headImg
                    Layout.preferredWidth: 50
                    Layout.preferredHeight: 50
                    anchors.top: parent.top
                    anchors.topMargin: 45
                    anchors.left: parent.left
                    anchors.leftMargin: (parent.width-userImg.width)*0.5
                }
                Frame {
                    id:frame
                    Layout.preferredWidth: 50
                    Layout.preferredHeight: parent.height-userImg.height
                    anchors.top: userImg.bottom
                    anchors.topMargin: 0
                    anchors.left: parent.left
                    anchors.leftMargin: (parent.width-frame.width)*0.5
                    padding:0

                    background:Rectangle{
                        color: "#2e2e2e"
                    }
                    ColumnLayout{
                        anchors.fill: parent
                        spacing:0

                        Button {
                            id:chat
                            Layout.preferredWidth: btnWidth
                            Layout.preferredHeight: btnHeight
                            anchors.top: chat.bottom
                            anchors.topMargin: btNtopMargin
                            anchors.horizontalCenter: parent.horizontalCenter
                            background: Rectangle{
                                anchors.fill: parent
                                color:"#2e2e2e"
                                radius:90
                                MouseArea{
                                    anchors.fill: parent;
                                    hoverEnabled: true;
                                    onEntered: {    //鼠标移入
                                    }
                                    onExited: {
                                    }
                                    onClicked: {
                                        menuA.loding("ChatListPage.qml")
                                    }
                                }
                            }
                            icon{
                                source: "qrc:/images/chat"
                                color:"#929292"
                                width: iconWidth+5
                                height: iconHeight+5
                            }
                        }

                        Button {
                            id:fiendList
                            Layout.preferredWidth: btnWidth
                            Layout.preferredHeight: btnHeight
                            anchors.top: chat.bottom
                            anchors.topMargin: btNtopMargin
                            anchors.horizontalCenter: parent.horizontalCenter
                            background: Rectangle{
                                anchors.fill: parent
                                color:"#2e2e2e"
                                radius:90
                                MouseArea{
                                    anchors.fill: parent;
                                    hoverEnabled: true;
                                    onEntered: {    //鼠标移入
                                    }
                                    onExited: {
                                    }
                                    onClicked: {
                                        menuA.loding("ChatFriendListPage.qml")
                                    }
                                }
                            }
                            icon{
                                source: "qrc:/images/通讯录"
                                color:"#929292"
                                width: iconWidth+5
                                height: iconHeight+5
                            }
                        }



                        Button {
                            id:shoucang
                            Layout.preferredWidth: btnWidth
                            Layout.preferredHeight: btnHeight
                            anchors.top: fiendList.bottom
                            anchors.topMargin: btNtopMargin
                            anchors.horizontalCenter: parent.horizontalCenter
                            background: Rectangle{
                                anchors.fill: parent
                                color:"#2e2e2e"
                                radius:90

                                MouseArea{
                                    anchors.fill: parent;
                                    hoverEnabled: true;
                                    onEntered: {    //鼠标移入
                                    }
                                    onExited: {
                                    }
                                    onClicked: {
                                        menuA.loding("ChatFriendListPage.qml")
                                    }
                                }
                            }
                            icon{
                                source: "qrc:/images/app"
                                color:"#929292"
                                width: iconWidth-5
                                height: iconHeight-5
                            }
                        }


                        Button {
                            id:chatFile
                            Layout.preferredWidth: btnWidth
                            Layout.preferredHeight: btnHeight
                            anchors.top: shoucang.bottom
                            anchors.topMargin: btNtopMargin
                            anchors.horizontalCenter: parent.horizontalCenter
                            background: Rectangle{
                                anchors.fill: parent
                                color:"#2e2e2e"
                                radius:90

                                MouseArea{
                                    anchors.fill: parent;
                                    hoverEnabled: true;
                                    onEntered: {    //鼠标移入
                                    }
                                    onExited: {
                                    }

                                    onClicked: {
                                        menuA.loding("ChatFriendListPage.qml")
                                    }
                                }
                            }
                            icon{
                                source: "qrc:/images/wenjianjia"
                                color:"#929292"
                                width: iconWidth-5
                                height: iconHeight-5
                            }
                        }

                        Button {
                            id:friendSpace
                            Layout.preferredWidth: btnWidth
                            Layout.preferredHeight: btnHeight
                            anchors.top: chatFile.bottom
                            anchors.topMargin: btNtopMargin
                            anchors.horizontalCenter: parent.horizontalCenter
                            background: Rectangle{
                                anchors.fill: parent
                                color:"#2e2e2e"
                                radius:90

                                MouseArea{
                                    anchors.fill: parent;
                                    hoverEnabled: true;
                                    onEntered: {    //鼠标移入
                                    }
                                    onExited: {
                                    }
                                    //打开朋友圈
                                    onClicked: {
                                        var newWindow = Qt.createComponent("FriendPage.qml").createObject(appWindoow);
                                    }
                                }
                            }
                            icon{
                                source: "qrc:/images/iconfontzhizuobiaozhunbduan36"
                                color:"#929292"
                                width: iconWidth-5
                                height: iconHeight-5
                            }
                        }

                        Button {
                            id:video
                            Layout.preferredWidth: btnWidth
                            Layout.preferredHeight: btnHeight
                            anchors.top: friendSpace.bottom
                            anchors.topMargin: btNtopMargin
                            anchors.horizontalCenter: parent.horizontalCenter
                            background: Rectangle{
                                anchors.fill: parent
                                color:"#2e2e2e"
                                radius:90

                                MouseArea{
                                    anchors.fill: parent;
                                    hoverEnabled: true;
                                    onEntered: {    //鼠标移入

                                    }
                                    onExited: {

                                    }

                                    onClicked: {
                                        menuA.loding("ChatFriendListPage.qml")
                                    }
                                }
                            }
                            icon{
                                source: "qrc:/images/shipinhao"
                                color:"#929292"
                                width: iconWidth-5
                                height: iconHeight-5
                            }
                        }



                        Button {
                            id:xiaochengxu
                            Layout.preferredWidth: btnWidth
                            Layout.preferredHeight: btnHeight
                            anchors.bottom: phone.top
                            anchors.horizontalCenter: parent.horizontalCenter
                            background: Rectangle{
                                anchors.fill: parent
                                color:"#2e2e2e"
                                radius:90

                                MouseArea{
                                    anchors.fill: parent;
                                    hoverEnabled: true;
                                    onEntered: {    //鼠标移入
                                        fiendList.icon.color = "red"
                                        //背景色
                                        fiendList.Rectangle.color ="moveRectangleColor";
                                    }
                                    onExited: {
                                        //移出icon颜色
                                        button.icon.color = removeIconCorlor;
                                        //移出背景色
                                        btnRectangle.color = removeRectangleColor;
                                    }

                                    onClicked: {
                                        menuA.loding("ChatFriendListPage.qml")
                                    }
                                }
                            }
                            icon{
                                source: "qrc:/images/xiaochengxu"
                                color:"#929292"
                                width: iconWidth-5
                                height: iconHeight-5
                            }
                        }

                        Button {
                            id:phone
                            Layout.preferredWidth: btnWidth
                            Layout.preferredHeight: btnHeight
                            anchors.bottom: setting.top
                            anchors.topMargin: btNtopMargin
                            anchors.horizontalCenter: parent.horizontalCenter
                            background: Rectangle{
                                anchors.fill: parent
                                color:"#2e2e2e"
                                radius:90

                                MouseArea{
                                    anchors.fill: parent;
                                    hoverEnabled: true;
                                    onEntered: {    //鼠标移入
                                        fiendList.icon.color = "red"
                                        //背景色
                                        fiendList.Rectangle.color ="moveRectangleColor";
                                    }
                                    onExited: {
                                        //移出icon颜色
                                        button.icon.color = removeIconCorlor;
                                        //移出背景色
                                        btnRectangle.color = removeRectangleColor;
                                    }

                                    onClicked: {
                                        menuA.loding("ChatFriendListPage.qml")
                                    }
                                }
                            }
                            icon{
                                source: "qrc:/images/shouji"
                                color:"#929292"
                                width: iconWidth-5
                                height: iconHeight-5
                            }
                        }

                        Button {
                            id:setting
                            Layout.preferredWidth: btnWidth
                            Layout.preferredHeight: btnHeight
                            anchors.bottom: parent.bottom
                            anchors.bottomMargin: 50
                            anchors.horizontalCenter: parent.horizontalCenter
                            background: Rectangle{
                                anchors.fill: parent
                                color:"#2e2e2e"
                                radius:90

                                MouseArea{
                                    anchors.fill: parent;
                                    hoverEnabled: true;
                                    onEntered: {    //鼠标移入
                                        fiendList.icon.color = "red"
                                        //背景色
                                        fiendList.Rectangle.color ="moveRectangleColor";
                                    }
                                    onExited: {
                                        //移出icon颜色
                                        button.icon.color = removeIconCorlor;
                                        //移出背景色
                                        btnRectangle.color = removeRectangleColor;
                                    }

                                    onClicked: {
                                        menuA.loding("ChatFriendListPage.qml")


                                    }
                                }
                            }
                            icon{
                                source: "qrc:/images/icdawu"
                                color:"#929292"
                                width: iconWidth-10
                                height: iconHeight-10
                            }
                        }


                    }

                }


            }
        }
        Rectangle{
            id:menuA
            Layout.preferredWidth: 250
            Layout.preferredHeight:  parent.height
            color: "blue"
            Loader {
                anchors.fill: parent
                id: menuShowList
                source: "ChatListPage.qml"
            }

            function loding(qmlUrl){
                menuShowList.setSource(qmlUrl)
            }
        }

        Rectangle{
            id:chatList
            Layout.preferredWidth: parent.width-menuList.width-menuA.width
            Layout.preferredHeight:  parent.height
            color: "#ffffff"
            Loader {
                anchors.fill: parent
                id: chatInfo
                source: ""
                property string friendName

            }

            function loding(qmlUrl,friendName){
                console.log("接收到参数:"+qmlUrl+"名字:"+friendName)
                chatInfo.source=qmlUrl
                //                    chatInfo.friendName=friendNamer

            }
        }
    }

    Component.onCompleted: {
        console.log("跳转到聊天页")
        console.log(user)
    }

}
